<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Zod | Documentation</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta
      name="description"
      content="TypeScript-first schema validation with static type inference"
    />
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta
      name="twitter:title"
      content="TypeScript-first schema validation with static type inference"
    />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@colinhacks" />
    <meta
      name="twitter:image:src"
      content="https://opengraph.githubassets.com/1cac1150838995e1f7d1643c00eee51a5d884f2054f995c9d3225b07b0eddb39/colinhacks/zod"
    />
    <meta
      property="og:image"
      content="https://opengraph.githubassets.com/1cac1150838995e1f7d1643c00eee51a5d884f2054f995c9d3225b07b0eddb39/colinhacks/zod"
    />
    <meta
      property="og:image:alt"
      content="TypeScript-first schema validation with static type inference"
    />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="600" />
    <meta property="og:site_name" content="GitHub" />
    <meta property="og:type" content="object" />
    <meta
      property="og:title"
      content="TypeScript-first schema validation with static type inference"
    />
    <meta property="og:url" content="https://github.com/colinhacks/zod" />
    <meta
      property="og:description"
      content="TypeScript-first schema validation with static type inference"
    />
    <link
      rel="apple-touch-icon"
      sizes="180x180"
      href="/static/apple-touch-icon.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/static/favicon-32x32.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="16x16"
      href="/static/favicon-16x16.png"
    />
    <link rel="manifest" href="/static/site.webmanifest" />
    <link
      rel="mask-icon"
      href="/static/safari-pinned-tab.svg"
      color="#5bbad5"
    />
    <link rel="shortcut icon" href="/static/favicon.ico" />
    <meta name="msapplication-TileColor" content="#da532c" />
    <meta name="msapplication-config" content="/static/browserconfig.xml" />
    <meta name="theme-color" content="#ffffff" />

    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-FG8DDV0GBR"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-FG8DDV0GBR");
    </script>

    <link
      rel="preload"
      href="//cdn.jsdelivr.net/npm/docsify@4.12.2/lib/themes/vue.css"
      type="text/css"
      as="style"
      onload="this.onload=null;this.rel='stylesheet';"
    />

  <style>
   body {
    margin: 0; /* Remove default body margin */
    padding: 0; /* Remove default body padding */
    font-family: Arial, sans-serif; /* Set a default font family */
  }
  .markdown-section {
    max-width: 100%; /* Allow the content to stretch to the full width */
    margin: 0 auto; /* Center the content on the page */
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
    padding: 20px; /* Add padding for better readability, adjust as needed */
  }

  p > img {
    max-width: 100%; /* Ensure images are responsive within the content */
    height: auto;
  }
  
      .markdown-section h2 {
        padding: 40px 0px 10px 0px;
        border-bottom: 1px solid #dbdbdb;
      }

      .markdown-section h3 {
        padding-top: 15px;
      }
      .markdown-section h3 code {
        font-size: 80%;
      }
      .sidebar {
        padding-top: 24px;
      }

      .sidebar::-webkit-scrollbar {
        width: 6px;
      }

      .theme-btn {
        position: relative;
        left: 15px;
        width: 24px;
        height: 24px;
        margin-bottom: 14px;
        background-image: url("./static/moon.svg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        cursor: pointer;
        z-index: 100;
      }
      @media only screen and (max-width: 768px) {
    .markdown-section {
      padding: 10px; /* Adjust padding for smaller screens */
    }
  }
  </style>
    <!-- Theme: dark -->
    <style>
        .dark,
  .dark .sidebar,
  .dark blockquote,
  .dark .sidebar a {
    background-color: #283339;
    color: #d3d3d3;
  }

      .dark .sidebar::-webkit-scrollbar-thumb {
        background: hsla(0, 0%, 88%, 0.4);
      }

      .dark .sidebar::-webkit-scrollbar-track {
        background: hsla(0, 0%, 53%, 0.1);
      }

      .dark .sidebar-toggle {
        background-color: hsl(201deg 18% 19% / 80%) !important;
      }

      .dark .markdown-section h1,
      .dark .markdown-section h2,
      .dark .markdown-section h3,
      .dark .markdown-section h4,
      .dark .markdown-section strong,
      .dark .anchor span {
        color: #fff;
      }

      .dark .markdown-section tr:nth-child(2n) {
        background-color: #1f282d;
      }

      .dark .markdown-section td,
      .dark .markdown-section th {
        border-color: #495e69;
      }

      .dark .markdown-section pre,
      .dark .markdown-section code {
        background-color: #34434b;
      }

      .dark .markdown-section code,
      .dark .token.keyword,
      .dark .token.function {
        color: #f07178;
      }

      .dark .markdown-section pre > code,
      .dark .token.punctuation {
        color: #f3f3f3;
      }

      .dark .token.number,
      .dark .token.boolean {
        color: #ffcb6b;
      }

      .dark .github-corner svg {
        color: #283339;
      }

      .dark .theme-btn {
        background-image: url("./static/sun.svg");
      }
    </style>



  </head>

  <body>
    <div class="theme-btn"></div>
    <div id="app"></div>
    <script src="//cdnjs.cloudflare.com/ajax/libs/docsify/4.12.2/docsify.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/components/prism-typescript.min.js"></script>
    <script>
      toggleDarkTheme(localStorage.getItem("dark-theme") === "true" || false);

      window
        .matchMedia("(prefers-color-scheme: dark)")
        .addEventListener("change", (e) => toggleDarkTheme(e.matches));

      document
        .querySelector(".theme-btn")
        .addEventListener("click", () => toggleDarkTheme());

      function toggleDarkTheme(force) {
        document.body.classList.toggle("dark", force);
        localStorage.setItem(
          "dark-theme",
          document.body.classList.contains("dark")
        );
      }
    </script>

    <script>
      window.$docsify = {
        subMaxLevel: 1,
        maxLevel: 3,
        auto2top: true,
        repo: "colinhacks/zod",
        routerMode: "history",
        crossOriginLinks: [
          "https://github.com/colinhacks/zod/actions?query=branch%3Amaster",
          "https://opensource.org/licenses/MIT",
          "https://www.npmjs.com/package/zod",
          "https://discord.gg/KaSRdyX2vc",
          "https://discord.gg/RcG33DQJdf",
          "https://github.com/colinhacks/zod/issues/new",
          "https://twitter.com/colinhacks",
          "https://trpc.io/",
          "https://zod.dev/",
          "https://deno.land/x/zod",
        ],
      };
    </script>
    <script>
      window.addEventListener("DOMContentLoaded", () => {
        document
          .querySelector("aside")
          .prepend(document.querySelector(".theme-btn"));
      });
    </script>
    <script src="https://www.unpkg.com/zod/lib/index.umd.js"></script>
  </body>
</html>
